<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
 <!DOCTYPE HTML >

<html>
  <head>
    <base href="<%=basePath%>">
    <title>应急预案管理_参考方案界面</title>
    <!-- date css -->
        <link rel="stylesheet" href="<%=basePath%>jclient/css/public/bootstrap.min.css" />
		<link rel="stylesheet" href="<%=basePath%>jclient/css/public/daterangepicker.css" />
   		<!-- date css -->
   		<!-- date javascript -->
		<script src="<%=basePath%>jclient/javascript/public/jquery.min.js"></script>
        <script src="<%=basePath%>jclient/javascript/public/bootstrap.min.js"></script>
		<script src="<%=basePath%>jclient/javascript/public/moment.js"></script>
		<script src="<%=basePath%>jclient/javascript/public/daterangepicker.js"></script>
		 <!-- date javascript -->  
	 	<!-- select -->
   		<link rel="stylesheet" href="<%=basePath%>jclient/css/public/style.css" type="text/css" />
   		<link href="<%=basePath%>jclient/css/public/select.css" rel="stylesheet" type="text/css" />
 		<script type="text/javascript" src="<%=basePath%>jclient/javascript/jslib/select-ui.min.js"></script>
   		<!-- select -->
	<script type="text/javascript">
	$(function(){
				// 日期选择
			    $('#cxdate').val(moment().subtract('days', 29).format('YYYY-MM-DD') + ' - ' + moment().format('YYYY-MM-DD'));
				$('#cxdate').daterangepicker(null, function(start, end, label) {
                    console.log(start.toISOString(), end.toISOString(), label);
                }); 
                $("#ckfaAddiv .tiptop a").click(function(){$("#ckfaAddiv").fadeOut(200);});
                $("#ckfaEditiv .tiptop a").click(function(){$("#ckfaEditiv").fadeOut(200);});
        });
	    function dealCKFA(val1){
	     $("#editCkfaName").val(val1);
	    $("#ckfaEditiv").fadeIn(200);} 
	</script>
	<style type="text/css">
	.daterangepicker{
	z-index: 9999;
	}
	</style>
  </head>
  <body style="background-color: #FFFFFF;width: 100%;height: 100%;" >
    <div class="tools" style="margin-top: 10px;padding: 0 10px;">
       <div style="width:80px;float: left;height: 30px;line-height: 30px;">
         <label>综合查询</label>
       </div>
       <div class="controls" style="width:210px;float: left;">
			<div class="input-group date datetime">
				<input id="cxdate" class="begindate form-control input-sm" size="16" type="text" value="" >
				<span class="input-group-addon"><span class="glyphicon glyphicon-time"></span></span>
			</div>
		</div>
	    <span style="float: left;display:inline-block;padding-left: 20px;height: 30px;line-height: 30px;">事件名称：</span>
	    <div style="width:310px;float: left;padding-left: 20px;">
         <input name="" type="text" class="scinput" style="position: relative;top: -3px;"/>&nbsp;&nbsp;&nbsp;&nbsp;<input name="" type="button" class="scbtn" value="查询"/>
       </div>   
    </div>
    <table class="tablelist" style="width: 100%;">
    	<thead>
    	<tr>
	        <th width="4%"><input name="" type="checkbox" value="" checked="checked"/></th>
	        <th width="6%">编号<i class="sort"><img src="<%=basePath%>jclient/css/public/images/px.gif" /></i></th>
	        <th width="70%">事件名称</th>
	        <th width="20%">操作</th>
        </tr>
        </thead>
        <tbody>
	        <tr>
		        <td><input name="" type="checkbox" value="" /></td>
		        <td>1</td>
		        <td>2012年8月23日关于于桥水库蓝藻中度暴发事件</td>
		        <td><a href="javascript:;" onclick="$('#ckfaAddiv').fadeIn(200);" class="tablelink">新增参考方案</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:#" class="tablelink">参考方案列表</a></td>
	        </tr> 
	        <tr>
		        <td><input name="" type="checkbox" value="" /></td>
		        <td>2</td>
		        <td>....................................................</td>
		        <td><a href="javascript:;" onclick="$('#ckfaAddiv').fadeIn(200);" class="tablelink">新增参考方案</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:#" class="tablelink">参考方案列表</a></td>
	        </tr> 
         </tbody>
    </table>
    <div class="pagin">
    	<div class="message">共<i class="blue">20</i>条记录，当前显示第&nbsp;<i class="blue">1&nbsp;</i>页</div>
        <ul class="paginList">
        <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
        <li class="paginItem"><a href="javascript:;">1</a></li>
        <li class="paginItem current"><a href="javascript:;">2</a></li>
        <li class="paginItem"><a href="javascript:;">3</a></li>
        <li class="paginItem"><a href="javascript:;">4</a></li>
        <li class="paginItem"><a href="javascript:;">5</a></li>
        <li class="paginItem more"><a href="javascript:;">...</a></li>
        <li class="paginItem"><a href="javascript:;">10</a></li>
        <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
        </ul>
    </div>
    <br>
    <div class="tools" style="margin-top: 10px;padding: 0 10px;">
     	 <ul class="toolbar1">
	   	     <li><span><img src="<%=basePath%>jclient/css/public/images/t03.png" style="position: relative;top: -7px;"/></span>批量删除</li>
	    </ul>    
    </div>
     <table class="tablelist" style="width: 100%;">
    	<thead>
    	<tr>
	        <th width="4%"><input name="" type="checkbox" value="" checked="checked"/></th>
	        <th width="6%">编号<i class="sort"><img src="<%=basePath%>jclient/css/public/images/px.gif" /></i></th>
	        <th width="70%">参考方案名称</th>
	        <th width="20%">操作</th>
        </tr>
        </thead>
        <tbody>
	        <tr>
		        <td><input name="" type="checkbox" value="" /></td>
		        <td>1</td>
		        <td>2015年8月1日于桥水库蓝藻中度暴发事件处置参考方案-1</td>
		        <td><a <a href="javascript:function nufu(){return false;}" onclick="dealCKFA('2015年8月1日于桥水库蓝藻中度暴发事件处置参考方案-1');" class="tablelink">编辑</a></td>
	        </tr> 
	        <tr>
		        <td><input name="" type="checkbox" value="" /></td>
		        <td>2</td>
		        <td>2015年8月1日于桥水库蓝藻中度暴发事件处置参考方案-2</td>
		        <td><a <a href="javascript:function nufu(){return false;}" onclick="dealCKFA('2015年8月1日于桥水库蓝藻中度暴发事件处置参考方案-2');" class="tablelink">编辑</a></td>
	        </tr> 
         </tbody>
    </table>
   <!--  <div class="pagin">
    	<div class="message">共<i class="blue">20</i>条记录，当前显示第&nbsp;<i class="blue">1&nbsp;</i>页</div>
        <ul class="paginList">
        <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
        <li class="paginItem"><a href="javascript:;">1</a></li>
        <li class="paginItem current"><a href="javascript:;">2</a></li>
        <li class="paginItem"><a href="javascript:;">3</a></li>
        <li class="paginItem"><a href="javascript:;">4</a></li>
        <li class="paginItem"><a href="javascript:;">5</a></li>
        <li class="paginItem more"><a href="javascript:;">...</a></li>
        <li class="paginItem"><a href="javascript:;">10</a></li>
        <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
        </ul>
    </div> -->
<!--修改参考方案-->  
<div id="ckfaEditiv" class="tip" style="left:50%;margin-left:-450px; width: 900px;height:503px;z-index: 100;top: 10px;border: 1px solid #cccccc;">
   <div class="tiptop"><span>修改参考方案</span><a></a></div>
   	<div style="height: 460px;overflow-y: scroll;">	
   				<table  cellpadding="5px" cellspacing="5px" border="1px">
    			    <tr height="50px">
    			       <td width="85px" style="text-align: right;">参考方案名称</td>
    			       <td  colspan="5" style="padding-left:10px;">
    					  <input id="editCkfaName" type="text" class="scinput" style="width: 780px;">
    			       </td>
    			    </tr>
    				<tr height="50px">
    					<td  style="text-align: right;">事件时间</td>
    					<td width="150px"style="padding-left:10px;" >
    						<input type="text" class="scinput" value="2015年09月02日 8:20" readonly="readonly">
    					</td>
    					<td width="160px" style="padding-right:10px;text-align: right;">事件地点</td>
    					<td width="150px" ><input type="text" class="scinput" readonly="readonly" value="于桥水库"></td>
    				
    					<td width="160px" style="padding-right:10px;text-align: right;">影响供水程度</td>
    			        <td  style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" value="小">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">事件概述</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <textarea rows="4"   style="border:solid 1px #a7b5bc;width: 780px;height: 60px;line-height: 25px;letter-spacing: 0px;list-style: none;" readonly="readonly">2015年7月27日，于桥水库水体藻类细胞密度为5300万个/L，水库随即增加监测频率，2015年8月1日8时37分，藻细胞密度为7080万个/L。已与当日8时50分上报于桥水库管理局，并已与当日9时提交事件初次报告。</textarea>
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">先期处置</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" style="width: 780px;" value="已立即组织队伍进行打捞.清理等工作。">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">事件等级</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" style="width: 780px;" value="Ⅲ">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">应急响应</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <textarea rows="4"   style="border:solid 1px #a7b5bc;width: 780px;height: 60px;line-height: 25px;letter-spacing: 0px;list-style: none;">（1）市指挥部办公室及时向市指挥部报告灾情和对工作的开展情况，重要情况要向市应急办报告。（2）市指挥部办公室下发防御通知，部署防御工作；视灾情召开分析会，派出工作组到受灾较重的地区知道抢险救灾工作。</textarea>
    			        </td>
    			    </tr>
    			    
    				<tr height="50px">
    					<td style="text-align: right;">应急队伍</td>
    					<td width="150px" colspan="5" style="padding-left:10px;"><input type="file" style="width: 150px;" ></td>
    					
    				</tr>
    				<tr height="50px">
    					<td  style="text-align: right;">效果预估</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <textarea rows="4"   style="border:solid 1px #a7b5bc;width: 780px;height: 60px;line-height: 25px;letter-spacing: 0px;list-style: none;"></textarea>
    			        </td>
    			    </tr>
    			</table>
    			<p align="center" style="margin-top: 10px;">
    			  <input name="" type="button" class="scbtn" value="保存"/>
    			</p>
    </div>	
</div>
<!--修改参考方案-->  
  <!--新增参考方案-->
<div id="ckfaAddiv" class="tip" style="left:50%;margin-left:-450px; width: 900px;height:503px;z-index: 100;top: 10px;border: 1px solid #cccccc;">
<div class="tiptop"><span>新增参考方案</span><a></a></div>
<div style="height: 460px;overflow-y: scroll;">	
                <!-- 事件 -->
                <table  cellpadding="5px" cellspacing="5px" border="1px">
    			    <tr height="50px">
    			       <td width="85px" style="text-align: right;">参考方案名称</td>
    			       <td  colspan="5" style="padding-left:10px;">
    					  <input id="editCkfaName" type="text" class="scinput" style="width: 780px;">
    			       </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">记录时间</td>
    					<td width="150px"style="padding-left:10px;" >
    						<input type="text" class="scinput" value="2015年09月02日 8:20" readonly="readonly">
    					</td>
    					<td width="160px" style="padding-right:10px;text-align: right;">记录人</td>
    					<td colspan="3" ><input type="text" class="scinput" readonly="readonly" value="张小名"></td>
    			    </tr>
    				<tr height="50px">
    					<td  style="text-align: right;">事件时间</td>
    					<td width="150px"style="padding-left:10px;" >
    						<input type="text" class="scinput" value="2015年09月02日 8:20" readonly="readonly">
    					</td>
    					<td width="160px" style="padding-right:10px;text-align: right;">事件地点</td>
    					<td width="150px" ><input type="text" class="scinput" readonly="readonly" value="于桥水库"></td>
    				
    					<td width="160px" style="padding-right:10px;text-align: right;">影响供水程度</td>
    			        <td  style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" value="小">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">事件概述</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <textarea rows="4"   style="border:solid 1px #a7b5bc;width: 780px;height: 60px;line-height: 25px;letter-spacing: 0px;list-style: none;" readonly="readonly">2015年7月27日，于桥水库水体藻类细胞密度为5300万个/L，水库随即增加监测频率，2015年8月1日8时37分，藻细胞密度为7080万个/L。已与当日8时50分上报于桥水库管理局，并已与当日9时提交事件初次报告。</textarea>
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">先期处置</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" style="width: 780px;" value="已立即组织队伍进行打捞.清理等工作。">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    					<td  style="text-align: right;">事件等级</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <input type="text" class="scinput" readonly="readonly" style="width: 780px;" value="Ⅲ">
    			        </td>
    			    </tr>
    			    <tr height="50px">
    			        <td  style="text-align: right;" rowspan="4">评价结果</td>
    			        <td  style="padding-left:10px;" >事件分析：</td>
    			        <td  colspan="4" style="padding-left:10px;">发现及时，范围可控。</td>
    			    </tr>
    			    	    <tr height="50px">
    			    	      <td  style="padding-left:10px;" >事件分级：</td>
    			              <td  style="padding-left:10px;">Ⅲ</td>
    			              <td  colspan="3" style="padding-left:10px;" >分级标准</td>
		    			    </tr>
		    			    <tr height="50px">
		    			    	<td  style="padding-left:10px;" >报警级别：</td>
    			                <td  colspan="4" style="padding-left:10px;">Ⅲ</td>
		    			    </tr>
		    			    <tr height="50px">
		    			        <td  style="padding-left:10px;" >响应级别：</td>
    			                <td  colspan="4" style="padding-left:10px;">Ⅲ</td>
		    			    </tr>
		    	    <tr height="50px">
    					<td  style="text-align: right;">事件等级</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <!-- select -->
						        <div class="uew-select"><div style="width: 100px;" class="uew-select-value ue-state-default"><em class="uew-select-text">Ⅲ</em><em class="uew-icon uew-icon-triangle-1-s"></em></div>
						                   <select style="width: 100px;" class="select3">
										    <option>Ⅲ</option>
										    <option>Ⅱ</option>
										    <option>Ⅰ</option>
										   </select>
							    </div>
					      <!-- select -->
    			        </td>
    			    </tr>	    
    			    <tr height="50px">
    					<td style="text-align: right;">执行预案</td>
    					<td width="150px" style="padding-left:10px;">
    						<!-- select -->
						        <div class="uew-select"><div style="width: 100px;" class="uew-select-value ue-state-default"><em class="uew-select-text">预案1</em><em class="uew-icon uew-icon-triangle-1-s"></em></div>
						                   <select style="width: 100px;" class="select3">
										    <option>预案1</option>
										    <option>预案2</option>
										    </select>
							    </div>
							    <!-- select -->
    					</td>
    			
    					<td width="160px" style="padding-right:10px;text-align: right;">应急队伍</td>
    					<td width="150px" colspan="3" style="padding-left:10px;"><input type="file" style="width: 150px;" ></td>
    				</tr>
    				<tr height="50px">
    					<td  style="text-align: right;">效果预估</td>
    			        <td colspan="5" style="padding-left:10px;">
    			          <textarea rows="4"   style="border:solid 1px #a7b5bc;width: 780px;height: 60px;line-height: 25px;letter-spacing: 0px;list-style: none;"></textarea>
    			        </td>
    			    </tr>
    		    </table>
    		    <p align="center" style="margin-top: 10px;">
    			  <input name="" type="button" class="scbtn" value="保存"/>
    			</p>
    			<!-- 事件材料 -->
    			<div class="tools" style="padding:10px 0 10px 10px;">
			      	<div class="uew-select" style="float: left;position: relative;top:2px;">
				         <div style="width: 100px;" class="uew-select-value ue-state-default"><em class="uew-select-text">文档资料</em><em class="uew-icon uew-icon-triangle-1-s"></em></div>
			             <select style="width: 100px;" class="select3">
					 				  <option>文档资料</option>
				    		          <option>表格资料</option>
				    		          <option>图片资料</option>
				    		          <option>视频资料</option>
				    		          <option>音频资料</option>
						 </select>
					</div>
				    <ul class="toolbar1" style="margin-right: 10px;">
				         <li style="cursor: pointer;" ><span><img src="<%=basePath%>jclient/css/public/images/t01.png" style="position: relative;top: -7px;"/></span>添加文件</li>    
				         <li><span><img src="<%=basePath%>jclient/css/public/images/t03.png" style="position: relative;top: -7px;"/></span>删除文件</li>
				         <li><span><img src="<%=basePath%>jclient/css/public/images/t02.png" style="position: relative;top: -7px;"/></span>批量下载</li>
				    </ul>
			    </div>
    			<table class="tablelist" style="width: 100%;">
			    	<thead>
			    	<tr>
				        <th width="5%"><input name="" type="checkbox" value="" checked="checked"/></th>
				        <th width="10%">编号<i class="sort"><img src="<%=basePath%>jclient/css/public/images/px.gif" /></i></th>
				        <th width="45%">文件名称</th>
				        <th width="20%">制定时间</th>
				        <th width="20%">操作</th>
			        </tr>
			        </thead>
			        <tbody>
				        <tr>
					        <td><input name="" type="checkbox" value="" /></td>
					        <td>1</td>
					        <td>2015年3月桥水蓝藻暴发事件</td>
					        <td>2015年3月</td>
					        <td><a href="#" class="tablelink">下载</a> <a href="#" class="tablelink"> 删除</a></td>
				        </tr> 
				        <tr>
					        <td><input name="" type="checkbox" value="" /></td>
					        <td>2</td>
					        <td>....................................................</td>
					        <td>2015年2月</td>
					        <td><a href="#" class="tablelink">下载</a>     <a href="#" class="tablelink"> 删除</a></td>
				        </tr> 
			         </tbody>
			    </table>
			   <!--  <div class="pagin">
			    	<div class="message">共<i class="blue">20</i>条记录，当前显示第&nbsp;<i class="blue">1&nbsp;</i>页</div>
			        <ul class="paginList">
			        <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
			        <li class="paginItem"><a href="javascript:;">1</a></li>
			        <li class="paginItem current"><a href="javascript:;">2</a></li>
			        <li class="paginItem"><a href="javascript:;">3</a></li>
			        <li class="paginItem"><a href="javascript:;">4</a></li>
			        <li class="paginItem"><a href="javascript:;">5</a></li>
			        <li class="paginItem more"><a href="javascript:;">...</a></li>
			        <li class="paginItem"><a href="javascript:;">10</a></li>
			        <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
			        </ul>
			    </div> -->
			    <!-- -事件材料 -->
			    
 		</div>
   </div>
  <!--新增参考方案-->  
  </body>
</html>
